@charset "utf-8";
@function r($px){
    @return $px/100+rem;
}
html,body{
    height:100%;
}
.mobile{
    header{
        width:100%;
        height:r(89);
        background:#b20000;
        overflow: hidden;
        .login{
            
            margin-top:r(32);
            margin-left:r(23);
//          list-style:square;
//          list-style-position:inside;
//          float:left;
            li{
                width:r(30);
                height:r(4);
                line-height: r(4);
                background:#fff;
                color:#fff;
                margin-top:r(6);
//              font-size:r(12);
                position:relative;
                &::before{
                    position:absolute;
                    top:0;
                    left:r(-5);
                    display:inline-block;
                    content:"";
                    width:r(4);
                    height:r(4);
                    background:#fff;
                }
            }
        }
        .logo{
            float:left;
            width:r(264);
            line-height:r(39);
            height:r(39);
            overflow: hidden;
            font-size:0;
            margin-top:r(-25);
            margin-left:r(170);
            img{
                width:100%;
            }
        }
        .search{
            float:right;
            width:r(43);
            height:r(43);
            overflow: hidden;
            margin-right:r(17);
            font-size:0;
            margin-top:r(-25);
            img{
                width:100%;
            }
        }
    }
    section{
        margin-bottom:r(96);
    }
    footer{
        position:fixed;
        bottom:0;
        padding-bottom:r(10);
        width:100%;
        overflow: hidden;
        background:#f5f5f5;
        height:r(96);
        border-top:r(1) solid #cccbcb;
        a{
            display:block;
            float:left;
            width:20%;
            font-size:0;
            padding-top:r(18);
            div{
                text-align: center;
              p{
                    font-size:r(17.76);
                    color:#8b8b8b;   
            }
            .fc{
                color:#b60207;
            }
        }
        .ft1{
                img{
                    width:r(47);
                    height:r(38);
                }
                p{
                        margin-top:r(10);
                    }
            }
            .ft2{
                img{
                    width:r(49);
                    height:r(40);
                }
                p{
                        margin-top:r(13);
                    }
            }
            .ft3{
               p{
                        margin-top:r(7);
                    }
                img{
                     width:r(41);
                    height:r(41);
                }
            }
            .ft4{
                p{
                        margin-top:r(2);
                    }
                img{
                    width:r(42);
                    height:r(46);
                }
            }
            .ft5{
                p{
                        margin-top:r(5);
                    }
                img{
                   width:r(70);
                    height:r(43);
                }
            }
            
            
        }
    }
}

//登录弹窗
#check{
    display:none;
}
#check1{
    display:none;
}
#check2{
    display:none;
}
#check20{
    display:none;
}
#check_entry{
    display:none;
}
#check_entry1{
    display:none;
}
#check:checked ~ .loginBox{
//  transform: translateX(0);
    left:0;
}

#check1:checked ~ .searchBox{
//  transform: translateY(0);
    top:0;
}
#check2:checked ~ .text2{
    display:block;
}
#check20:checked ~ .text20{
    display:block;
}
#check_entry:checked ~ .entry{
//  transform: translateX(0);
    left:0;
}
#check_entry1:checked ~ .loginBox1{
//  transform: translateX(0);
    left:0;
}
.loginBox{
    z-index:2;
    width:100%;
    height:100%;
    background:#222222;
    position:fixed;
    top:0;
//  transform: translateX(-100%);
    left:-100%;
    transition:0.5s;
    .back{
        position:absolute;
        top:r(32);
        left:r(23);
        display:inline-block;
        width:r(43);
        height:r(43);
        background:#b60005;
        color:#fff;
        font-size:r(40);
        text-align: center;
//      line-height:r(43);
        margin-top:r(10);
        border-radius: 50%;
    }
    .login_top{
        width:100%;
        height:r(360);
        margin-top:r(86);
        padding:0 r(13);
        padding-top:r(16);
        font-size:0;
        .touxiang{
            width:r(130);
            height:r(130);
            margin:0 auto;
            margin-top:r(85);
            img{
                width:100%;
            }
        }
        h3{
            font-size:r(24.86);
            text-align: center;
            margin-top:r(20);
            label{
                color:#fff;
            }
        }
        p{
            font-size:r(19.53);
            text-align: center;
            margin-top:r(5);
            a{
                color:#525252;
                text-decoration: underline;
            }
        }
    }
    .title{
        width:100%;
        height:r(24);
        background:#303030;
    }
    .login_bottom{
        padding:0 r(30);
        margin-top:r(52);
        .text1{
            overflow: hidden;
            width:100%;
            height:r(90);
            h3{
                font-size:r(23.08);
                font-weight: normal;
                color:white;
                float:left;
                line-height:r(90);
            }
            span{
                float:right;
                color:white;
                font-size:r(15);
                line-height:r(90);
            }
            hr{
                margin-top:0;
            }
        }
        .text2{
            display:none;
            padding:0 r(118);
            p{
                font-size:r(15);
                color:#fff;
                text-align: center;
                height:r(83);
                line-height:r(83);
                a{
                    color:white;
                }
            }
            p:first-child{
                border-bottom:1px solid #2c2c2c;
            }
        }
        .text3{
            border-bottom:1px solid #2c2c2c;
            }
    }
}
//搜索弹窗
.searchBox{
    z-index:2;
    width:100%;
    height:100%;
    background:#f1f1f1;
    position:fixed;
    top:-100%;
//  transform: translateY(-100%);
    transition:all 0.5s ease;
    .search_top{
        width:100%;
        height:r(87);
        background:#1d1d1d;
        .back{
            position:absolute;
            top:r(10);
            left:r(13);
            display:inline-block;
            width:r(43);
            height:r(43);
            background:#b60005;
            color:#fff;
            font-size:r(40);
            text-align: center;
            margin-top:r(10);
            border-radius: 50%;
        }
      
        .search2{
            width:r(534);
            height:r(52);
            border-radius: r(24);
            border:1px solid #fff;
            float:right;
            margin-top:r(20);
            margin-right:r(18);
            font-size:0;
            input[type="text"]{
                width:r(440);
                height:r(45);
                line-height: r(45);
                vertical-align: middle;
                border:none;
                margin-left:r(28);
                font-size:r(24);
                background:#1d1d1d;
                margin-top:r(2);
                color:#fff;
            }
            input[type="image"]{
                width:r(27);
                height:r(27);   
                margin-left:r(16);
                vertical-align: middle;
                margin-top:r(4);
            }
        }
    }
    .search_bottom{
        width:100%;
        height:50%;
        font-size:0;
        padding:0 r(30);
        .resou{
            padding-top:r(32);
            h3{
                font-size:r(26.63);
                margin-bottom:r(6);
            }
            p{
                font-size:r(29.23);
                display:inline-block;
                height:r(57);
                line-height: r(57);
                background:#fff;
                margin-top:r(10);
                margin-right:r(8);
                border:r(1) solid #e1e1e1;
                color:#8b8b8b;
                padding:0 r(18);
            }
            p:hover{
                background:#b20000;
                color:white;
            }
        }
    }
}
//立即登录弹窗
.entry{
    z-index:4;
    background:#222222;
    width:100%;
    height:100%;
    position:fixed;
    top:0;
    left:-100%;
//  transform: translateX(-100%);
    .box{
        width:100%;
        height:100%;
        padding-top:r(191);
        .box_logo{
            margin:0 auto;
            width:r(161);
            height:r(136);
            img{
                width:100%;
            }
        }
        .box_login{
            padding-left:r(75);
            padding-top:r(47);
            .user{
                overflow: hidden;
                .user_left{
                    float:left;
                    width:r(61);
                    height:r(53);
                    padding-top:r(11);
                    background:#303030;
                    font-size:0;
                    text-align: center;
                    
                    img{
                        width:r(29);
                        height:r(30);
                    }
                }
                .user_right{
                    font-size:0;
                    float:left;
                    height:r(53);
                    input{
                        width:r(430);
                        height:r(53);
                        font-size:r(20);
                        padding-left:r(29);
                        background:#3d3d3d;
                        border:none;
                        color:#cdcdcd;
                    }
                }
            }
            .password{
                overflow: hidden;
                margin-top:r(16);
                .password_left{
                    float:left;
                    width:r(61);
                    height:r(53);
                    padding-top:r(11);
                    background:#303030;
                    font-size:0;
                    text-align: center;
                    
                    img{
                        width:r(27);
                        height:r(32);
                    }
                }
                .password_right{
                    font-size:0;
                    float:left;
                    height:r(53);
                    input{
                        width:r(430);
                        height:r(53);
                        font-size:r(20);
                        padding-left:r(29);
                        background:#3d3d3d;
                        border:none;
                        color:#cdcdcd;
                    }
                }
            }
        }
        .forget_password{
            font-size:0;
            float:right;
            margin-right:r(79);
            margin-top:r(29);
            img{
                width:r(19);
                height:r(19);
                padding-top:r(2);
            }
            p{
                margin-left:r(6);
                font-size:r(19.53);
                display:inline-block;
                color:#fff;
                
            }
        }
        .but{
            font-size:0;
            padding-left:r(75);
            label{
                
                p{
                    display:inline-block;
                    width:r(492);
                    height:r(53);
                    line-height: r(53);
                    border:r(1) solid #2e1f20;
                    background:#303030;
                    color:white;
                    font-size:r(23.08);
                    text-align: center;
                }
            }
            label:first-child p{
                    margin-top:r(59);
                }
            label:nth-child(2) p{
                margin-top:r(14);
                }
            label p:hover{
                
                    background:#b60005;
               
            }
        }
    }
}

//登录成功
.loginBox1{
    z-index:9;
    width:100%;
    height:100%;
    background:#222222;
    position:fixed;
    top:0;
//  transform: translateX(-100%);
    left:-100%;
    .back{
        position:absolute;
        top:r(32);
        left:r(23);
        display:inline-block;
        width:r(43);
        height:r(43);
        background:#b60005;
        color:#fff;
        font-size:r(40);
        text-align: center;
//      line-height:r(43);
        margin-top:r(10);
        border-radius: 50%;
    }
    .login_top{
        width:100%;
        height:r(447);
        margin-top:r(86);
        padding:0 r(13);
        padding-top:r(16);
        font-size:0;
        
        .chenxiaomin{
            width:r(135);
            height:r(130);
            margin:0 auto;
            margin-top:r(85);
            img{
                width:100%;
            }
        }
        .name{
            text-align: center;
            h3{
            font-size:r(24.86);
            text-align: center;
            margin-top:r(20);
            font-size:r(24.86);
            color:#fff;
            display:inline-block;
        }
            span{
                font-size:r(19.53);
                text-align: center;
                font-size:r(14.2);
                color:#fff;
                border:r(1) solid #fff;
                padding:r(3) r(10);
                margin-left:r(10);
            }
        }
        .wujiaoxing{
            text-align: center;
            margin-top:r(9);
        }
        .guanzhu{
            text-align: center;
            margin-top:r(11);
            p{
                font-size:r(23.08);
                display:inline-block;
                color:#fff;
            }
            p:nth-child(2n){
                color:#b60005;
                margin-left:r(9);
            }
            p:nth-child(2)::after{
                content: "|";
                color:#a2a2a2;
                margin-left:r(9);
                margin-right:r(9);
            }
        }
        .shoucangfabu{
            overflow: hidden;
            margin:0 auto;
            .shoucang{
                float:left;
                width:r(219);
                height:r(52);
                background:#cdcdcd;
                border-radius: r(25);
                margin-left:r(90);
                p{
                    color:#fff;
                    font-size:r(23.08);
                    text-align: center;
                    line-height: r(52);
                }
            }
            .fabu{
                float:left;
                width:r(219);
                height:r(52);
                background:#cdcdcd;
                border-radius: r(25);
                margin-left:r(22);
                p{
                    text-align: center;
                    color:#fff;
                    font-size:r(23.08);
                    line-height: r(52);
                    a{
                        color:#fff;
                    }
                }
            }
            div:hover{
                background:#b60005;
            }
        }
    }
    .title{
        width:100%;
        height:r(24);
        background:#303030;
    }
    .login_bottom{
        padding:0 r(30);
        margin-top:r(52);
        .text1{
            overflow: hidden;
            width:100%;
            height:r(90);
            h3{
                font-size:r(23.08);
                font-weight: normal;
                color:white;
                float:left;
                line-height:r(90);
            }
            span{
                float:right;
                color:white;
                font-size:r(15);
                line-height:r(90);
            }
            hr{
                margin-top:0;
            }
        }
        .text20{
            display:none;
            padding:0 r(118);
            p{
                font-size:r(15);
                color:#fff;
                text-align: center;
                height:r(83);
                line-height:r(83);
                a{
                    color:white;
                }
            }
            p:first-child{
                border-bottom:1px solid #2c2c2c;
            }
        }
        .text3{
            border-bottom:1px solid #2c2c2c;
            }
    }
    .tuichu{
        margin:0 auto;
        background:#b60005;
        width:r(179);
        height:r(52);
        border-radius: r(26);
        p{
            font-size:r(23.08);
            color:white;
            text-align: center;
            line-height:r(52);
        }
    }
}
